<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        .box{
            width: 100px;
            height: 100px;
            background: red;
        }
    </style>
</head>
<body>
    <div class="box"></div>
    <script>
        // 1.定时器的执行顺序；
        // console.log(111)
        // // 异步代码会放在异步队列里执行，异步队列一定在同步队列之后；
        // setTimeout(function(){
        //     console.log(222)
        // },0)
        // console.log(333);

        // 2.定时器里的this
        // 定时器里的this是指向window
        // var obj = {
        //     name:"张三",
        //     fn:function(){
        //         console.log(this);
        //         setTimeout(function(){
        //             console.log(this)
        //         }, 1000);
        //     }
        // }

        // obj.fn();


        // 3.事件里的this : 会指向事件源
          var ele =   document.querySelector(".box");
          ele.onclick = function(){
              console.log(this);
              console.log(ele);
          }

        //   1.复习 2.实现一个用户名和密码注册 跳转到另一个页面显示；3.回到顶部功能（慢慢的一点点）setinterval来减
        //   4.完善流氓广告 关了之后过一段时间还有显示；

        //     var num = 1000;
//  var timer =   setInterval(function(){
//         num-=100;
//         console.log(num);
//         if(num<0){
//             clearInterval(timer)
//         }
//     }, 1000);

    </script>
</body>
</html>